<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>用户中心-${setting.name}</title>
    [#include "/common/include.ftl"/]
    <link rel="stylesheet" href="${base}/resource/plug/buttons/buttons.css">
    <link rel="styleSheet" href="${base}/resource/css/member.css">
    <link rel="stylesheet" href="${base}/resource/plug/layui/css/layui.css">
    <script src="${base}/resource/plug/layui/layui.js"></script>
    <script src="${base}/resource/js/member.js"></script>
    <script src="${base}/resource/js/unslider.min.js"></script>

    <script src="${base}/resource/js/order.js"></script>
    <script src="${base}/resource/js/order.module.js"></script>
    <script src="${base}/resource/js/clipboard.min.js"></script>
</head>
<body class="customer">
[#include "/common/header.ftl"/]
<div class="crumbs">
    <a href="">会员中心</a>
</div>
<div id="member-main">
    [#assign menuNo='index'/]
    [#include "/common/member-left.ftl"/]
    <div class="member-right">
        <div class="right-wrap">

            <div id="member-index">
                <div class="member-info-t m-box">
                    <div class="fl">
                        <div class="info-lcol">
                            <div class="m-photo"><a><img src="${base}/resource/images/default_logo.jpg" width="100" height="100"></a></div>
                            <div class="info-m">
                                <div class="name"><a href="javascript:">${member.username}</a></div>
                                <div class="level">[#if !member.point??]普通会员
                                [#elseif member.point gte 100000]钻石会员
                                [#elseif member.point gte 50000 && member.point < 100000]黄金会员
                                [#elseif member.point gte 10000 && member.point < 50000]白银会员
                                [#elseif member.point<10000]普通会员 [/#if]</div>
                                <div class="level">余额：${(member.deposit)!'0.00'}元</div>
                                <div class="level">累计积分：${(member.intergral)!'0.00'}分</div>
                                <div class="safe"><span>账户安全:</span>
                                    <i class="s[#if member.mobile?? && member.email??]5[#elseif !member.mobile?? && !member.email??]2[#else]4[/#if]"></i>
                                    <strong>[#if member.mobile?? && member.email??]高[#elseif !member.mobile?? && !member.email??]低[#else]中[/#if]</strong></div>
                            </div>
                        </div>

                        <div class="user-count">
                            <ul>
                                <li>
                                    <a href="${base}/order/list.jhtml?status=0">
                                        <i class="i1"></i>
                                        <p><span>待付款</span><strong>${count('order','waitBuyerPay')} </strong></p>
                                    </a>
                                </li>
                                <li>
                                    <a href="${base}/order/list.jhtml?status=1">
                                        <i class="i2"></i>
                                        <p><span>待发货</span><strong>${count('order','waitSellerSendGoods')} </strong></p>
                                    </a></li>
                                <li>
                                    <a href="${base}/order/list.jhtml?status=2">
                                        <i class="i3"></i>
                                        <p><span>待签收</span><strong>${count('order','waitBuyerConfirmGoods')} </strong></p>
                                    </a>
                                </li>
                                <li>
                                    <a href="${base}/order/list.jhtml?status=3">
                                        <i class="i4"></i>
                                        <p><span>已完成</span><strong>${count('order','tradeFinished')} </strong></p>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="fr m-n"></div>

                </div>
                <div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">邀请好友：</label>
                        <div class="layui-input-inline" style="width: 500px">
                            <input  class="layui-input" type="text" value="http://${setting.domain}/register.jhtml?inviter=${member.id}" style="width:500px" disabled>
                        </div>
                        <div class="layui-form-mid"> <button  class="layui-btn button_copy" >复制</button></div>
                    </div>
                </div>
                <script>

                    layui.use('layer', function() {
                        var layer = layui.layer; //获得layer组件
                        var clipboard = new Clipboard('.button_copy', {
                            text: function(trigger) {
                                var text =  $(trigger).closest('.layui-form-item').find("input").val();
                                return text;
                            }
                        });

                        clipboard.on('success', function(e) {
                            layer.msg("复制成功！");
                            e.clearSelection();
                        });

                        clipboard.on('error', function(e) {
                            layer.msg("复制失败！", { icon: 2 });
                        });
                    });

                </script>
                <div class="member-order m-box m-l">
                    <h2><span>积分订单</span>[#--<a href="${base}/orderintergal/list.jhtml" class="more">查看全部订单</a>--]</h2>
                    <div class="orders mc">
                        [#if orderList?has_content]
                        <div class="order-list mt10">
                            <table class="member-table-list" id="order-list">
                                <tr>
                                    <th width="30%">订单信息</th>
                                    <th width="10%"> 收货人</th>
                                    <th width="15%"> 订单积分</th>
                                    <th width="20%"> 购买时间</th>
                                    <th width="10%"> 状态</th>
                                   
                                </tr>
                                [#list intergralorderList as order]
                                <tr class="h">
                                    <td colspan="6">
                                        <span>订单编号：</span>
                                        <a href="#">${order.orderNo}</a>
                                      
                                    </td>
                                </tr>
                                <tr class="p-l">
                                    <td class="p-img">
                                       
                                            <a href="${base}/intergral/content/${order.id}.jhtml" target="_blank">
                                                <img class="lazy" data-original="[@Pic pic=order.litpic postfix="50x50"/]" postfix="50x50" style="width: 50px;height: 50px">
                                            </a>
                                           
                                    </td>
                                    <td>${order.name}</td>
                                    <td>
                                        <p>${order.intergral}</p>
                                        <p>积分兑换</p>
                                    </td>
                                    <td>${order.createDate?date}</td>
                                    <td>
                                        [#if order.status = 'unsend']
                                            尚未发货
                                        [#elseif order.status = 'send']
                                            正在发货
                                        [#elseif order.status = 'received']
                                            已完成
                                  
                                        [/#if]
                                    </td>
                                    
                                </tr>
                                [/#list]
                            </table>
                        </div>
                        [#else]
                            <div class="empty-ico"><i></i><span>您买的东西太少了，这里都空空的，快去挑选合适的商品吧！</span></div>
                        [/#if]
                    </div>
                </div>
                
                
                  <div class="member-order m-box m-l">
                    <h2><span>我的订单</span><a href="${base}/order/list.jhtml" class="more">查看全部订单</a></h2>
                    <div class="orders mc">
                        [#if orderList?has_content]
                        <div class="order-list mt10">
                            <table class="member-table-list" id="order-list">
                                <tr>
                                    <th width="30%">订单信息</th>
                                    <th width="10%"> 收货人</th>
                                    <th width="15%"> 订单金额</th>
                                    <th width="20%"> 下单时间</th>
                                    <th width="10%"> 状态</th>
                                    <th>操作</th>
                                </tr>
                                [#list orderList as order]
                                <tr class="h">
                                    <td colspan="6">
                                        <span>订单编号：</span>
                                        <a href="${base}/order/detail.jhtml?orderNo=${order.orderNo}">${order.orderNo}</a>
                                       [#-- <a style="float:right; margin-right: 10px;" href="#">还要买</a>--]
                                    </td>
                                </tr>
                                <tr class="p-l">
                                    <td class="p-img">
                                        [#list order.items as item]
                                            [#if item_index < 4]
                                            <a href="${base}/goods/${item.goodsId}.jhtml" target="_blank">
                                                <img class="lazy" data-original="[@Pic pic=item.image postfix="50x50"/]" postfix="50x50" style="width: 50px;height: 50px">
                                            </a>
                                            [/#if]
                                        [/#list]
                                    </td>
                                    <td>${order.consignee}</td>
                                    <td>
                                        <p>${currency(order.totalAmount, true)}</p>
                                        <p>在线支付</p>
                                    </td>
                                    <td>${order.createDate?date}</td>
                                    <td>
                                        [#if order.orderStatus = 'waitBuyerPay']
                                            等待买家付款
                                        [#elseif order.orderStatus = 'waitSellerSendGoods']
                                            正在发货
                                        [#elseif order.orderStatus = 'waitBuyerConfirmGoods']
                                            已发货
                                        [#elseif order.orderStatus = 'tradeFinished']
                                            交易完成
                                        [#elseif order.orderStatus = 'tradeClosed']
                                            交易关闭
                                        [/#if]
                                    </td>
                                    <td>
                                        [#assign data = "{orderNo:'${order.orderNo}',status:'${order.orderStatus}'}" /]
                                        [#if order.orderStatus = 'waitBuyerPay']
                                            <a data="${data}" class="onlile-payment" href="javascript:;">在线支付</a>
                                            <span>|</span>
                                            <a data="${data}" class="cancel-order" href="javascript:;">取消</a>
                                        [#elseif order.orderStatus = 'waitSellerSendGoods']
                                            [#if !order.hasRefunded ]
                                                <a data="${data}" class="order-refund" href="javascript:">申请退换货</a>
                                            [#else]
                                                <br/>
                                                <a data="${data}" class="order-refund-detail" href="javascript:">退换货详情</a>
                                            [/#if]
                                        [#elseif order.orderStatus = 'waitBuyerConfirmGoods']
                                            <a data="${data}" class="wait-buyer-confirm-goods" href="javascript:;">确认收货</a>
	                                        [#if order.hasRefunded ]
	                                            <br/>
	                                            <a data="${data}" class="order-refund-detail" href="javascript:">退换货详情</a>
	                                        [/#if]
                                        [#elseif order.orderStatus = 'tradeFinished']
                                            <a data="${data}" class="order-comment" href="javascript:;">评价</a>
                                            <span>|</span>
                                            <a data="${data}" class="delete-order" href="javascript:;">删除</a>
                                            [#if !order.hasRefunded ]
                                                <br/>
                                                <a data="${data}" class="order-refund" href="javascript:;">申请退换货</a>
                                            [#else]
                                                <br/>
                                                <a data="${data}" class="order-refund-detail" href="javascript:;">退换货详情</a>
                                            [/#if]
                                        [#elseif order.orderStatus = 'tradeClosed']
                                            <a data="${data}" class="delete-order" href="javascript:;">删除</a>
                                        [/#if]

                                        <br><a target="_blank" href="${base}/order/detail.jhtml?orderNo=${order.orderNo}">订单详情</a>
                                    </td>
                                </tr>
                                [/#list]
                            </table>
                        </div>
                        [#else]
                            <div class="empty-ico"><i></i><span>您买的东西太少了，这里都空空的，快去挑选合适的商品吧！</span></div>
                        [/#if]
                    </div>
                </div>
                
                
                <div class="member-veri m-box m-l">
                    <h2><span>我的收藏</span><a href="${base}/member/favorite.jhtml" class="more">查看全部收藏</a></h2>
                    <div class="list mc">
                        [#if favoriteList?has_content]
                            <div class="fol-p-con">
                                <a href="javascript:" class="slider-btn prev"><b></b></a>
                                <a href="javascript:" class="slider-btn next"><b></b></a>

                                <div class="slider-show">
                                    <div class="slider-show-c">
                                        [#list favoriteList as goods]
                                            [#if goods_index%6 = 0]
                                            <ul>
                                            [/#if]
                                            <li>
                                                <a title="${goods.name}" target="_blank" href="${goods.path}">
                                                    <img class="lazy" data-original="[@Pic pic=goods.image_default postfix='160x160'/]" postfix="160x160">
                                                </a>
                                                <p>${currency(goods.marketPrice, true)}</p>
                                            </li>
                                            [#if (goods_index+1)%6==0 || goods_index=favoriteList?size]
                                            </ul>
                                            [/#if]
                                        [/#list]
                                    </div>
                                </div>
                            </div>
                        [#else]
                            <div class="empty"><span>您还没有收藏商品。快去收藏自己喜欢的商品吧！       </span></div>
                        [/#if]
                    </div>
                </div>
                <div class="member-history m-box m-l">
                    <h2><span>浏览历史</span></h2>

                    <div class="list mc">

                    </div>
                </div>
                <script>(function () {
                    $(function () {
                        loadHistory();

                        return $('.m-box').find('.fol-p-con').each(function (i) {
                            var data, slider;
                            slider = $(this).find('.slider-show').unslider({
                                items: '.slider-show-c',
                                item: 'ul',
                                autoplay: false,
                                loop: false
                            });
                            data = slider.data('unslider');
                            return $(this).find('.prev').click(function () {
                                return data.prev();
                            }).end().find('.next').click(function () {
                                return data.next();
                            });
                        });
                    });

                }).call(this);

                //加载浏览历史
                function loadHistory(){
                    ajax({
                        url: base + "/history.jhtml",
                        showError: true,
                        async:false,
                        cache: false,
                        success: function(data){
                            var html = template('history', {"list":data});
                            $('.member-history .list.mc').html(html);
                            $('.member-history .list.mc img.lazy').lazyload({threshold:500,failure_limit:20});
                        }
                    });
                }
                </script>
            </div>
        </div>
    </div>
    <div class="clear"></div>
</div>
[#include "common/footer-slidebar-lazyload.ftl"]
<script id="history" type="text/html">
    {{if list.length > 0}}
    <div class="fol-p-con">
        <a href="javascript:" class="slider-btn prev"><b></b></a>
        <a href="javascript:" class="slider-btn next"><b></b></a>
        <div class="slider-show">
            <div class="slider-show-c">
                {{each list}}
                {{if $index%6 == 0}}
                <ul>
                    {{/if}}
                    <li>
                        <a title="{{$value.name}}" target="_blank" href="{{$value.path}}"><img class="lazy" data-original="{{$value.image_default}}" postfix="166x166"></a>
                        <p>{{$value.price | currency:'2'}}</p>
                    </li>
                    {{if ($index+1)%6 == 0  || $index == list.length}}
                </ul>
                {{/if}}
                {{/each}}

            </div>
        </div>
    </div>
    {{else}}
        <div class="empty-ico"><i></i><span>您还没有浏览商品 </span></div>
    {{/if}}
</script>
</body>
</html>